<template>
	<view class="Details">
		<view class="DetailsShop">
			<view class="DetailsShopTop">
				<view class="DetailsShopTopLeft">
					<image :src="list.img" mode="aspectFill"></image>
				</view>
				<view class="DetailsShopTopRight">
					<view>{{list.name}}</view>
					<view>序列号：{{list.goods_num}}</view>
					<view>x{{list.num}}</view>
				</view>
			</view>

		</view>
		<view class="tabaddd">
			<view class="tabaddd_top">
				<text :class="order_type == 1?'textColor':''" @click="order_type = 1">到店取货</text>
				<text :class="order_type == 2?'textColor':''" @click="order_type = 2">邮寄发货</text>
			</view>
			<view class="shopJia" v-if="list.shop && order_type == 1">
				<view class="shopJiaLeft">
					<view>
						<image src="https://www.kmdj2018.com/Uploads/zfb/shop01.png" mode="aspectFit"></image>
						<text>{{list.shop.name}}</text>
					</view>
					<view>
						<image src="https://www.kmdj2018.com/Uploads/zfb/shop02.png" mode="aspectFit"></image>
						<text>{{list.shop.pro_name}}{{list.shop.city_name}}{{list.shop.area_name}}{{list.shop.add_ress}}</text>
					</view>
					<view>
						<image src="https://www.kmdj2018.com/Uploads/zfb/shop03.png" mode="aspectFit"></image>
						<text>{{list.shop.phone}}</text>
					</view>
				</view>
				<view class="shopJiaRight"></view>
			</view>
			<view class="tabaddd_address" v-if="order_type==2">
				<view class="tabaddd_address_null" @click="getnav('/pages/addlist/addlist')"
					v-if="addresList.length == 0">
					<view class="tabaddd_address_null_img">
						<image src="https://www.kmdj2018.com/Uploads/zfb/shop02.png" mode="aspectFit"></image>
					</view>
					<view class="tabaddd_address_null_text">
						暂无 <text>（请选择收货地址）</text>
					</view>
					<view class="tabaddd_address_null_img">
						<image src="https://www.kmdj2018.com/Uploads/zfb/right.png" mode="aspectFit"></image>
					</view>
				</view>
				<view class="tabaddd_address_res" @click="getnav('/pages/addlist/addlist')" v-else>
					<view class="tabaddd_address_null_img">
						<image src="https://www.kmdj2018.com/Uploads/zfb/shop02.png" mode="aspectFit"></image>
					</view>
					<view class="tabaddd_address_null_text" v-for="(item,key) in addresList" :key="key">
						<view class="addlisttop">
							<view class="addlisttop_text">
								<view class="addlisttop_left">
									姓名：{{item.name}}
								</view>
								<view class="addlisttop_right">
									联系电话：{{item.phone}}
								</view>
							</view>
							<view class="addlisttop_address">
								收货地址：{{item.pro_name}}{{item.city_name}}{{item.area_name}}{{item.add_ress}}
							</view>
						</view>
					</view>
					<view class="tabaddd_address_null_img">
						<image src="https://www.kmdj2018.com/Uploads/zfb/right.png" mode="aspectFit"></image>
					</view>
				</view>
			</view>
		</view>
		<!-- 文字 -->
		<view class="allinfo">
			<view class="allinfo_title">
				基本信息
			</view>
			<view class="allinfo_for">
				<view>姓名</view>
				<input type="text" placeholder="请输入您的姓名" placeholder-style="font-size: 28rpx;" v-model="real_name">
			</view>
			<view class="allinfo_for">
				<view>手机号</view>
				<input type="number" placeholder="请输入您的手机号" placeholder-style="font-size: 28rpx;" v-model="mobile">
			</view>
			<view class="allinfo_for">
				<view>身份证号码</view>
				<input type="text" placeholder="请输入您的身份证号码" placeholder-style="font-size: 28rpx;" v-model="idcard">
			</view>
			<view class="allinfo_for">
				<view>银行卡号码</view>
				<input type="text" placeholder="请输入您的银行卡号码" placeholder-style="font-size: 28rpx;" v-model="accountNo">
			</view>
		</view>
		<view class="allinfo">
			<view class="allinfo_title">
				个人材料
			</view>
			<view class="allinfo_imgfor">
				<view>身份证（人像面）</view>
				<image :src="real_zheng" mode="aspectFill" v-if="real_zheng" @click="unploadImg(1)"></image>
				<image src="../../static/sc.png" mode="aspectFill" v-else @click="unploadImg(1)"></image>
			</view>
			<view class="allinfo_imgfor">
				<view>身份证（国徽面）</view>
				<image :src="real_fan" mode="aspectFill" v-if="real_fan" @click="unploadImg(2)"></image>
				<image src="../../static/sc.png" mode="aspectFill" v-else @click="unploadImg(2)"></image>
			</view>
		</view>


		<view class="DetailsTime" v-if="list.statusTwo == 3">
			<view class="DetailsTimeTiele">
				选择期限
			</view>
			<view class="" style="height: 32rpx;">

			</view>
			<view class="DetailsTimeNum">
				<view>
					单期期限：{{list.day}}天 <text> | </text> 最少期数：{{list.small_day}}期
				</view>
				<view>
					<lxc-count @handleCount="handleCountClick" :min="parseFloat(list.small_day)" :value="list.value"
						:delayed="100">
					</lxc-count>
				</view>
			</view>
			<view class="DetailsTimePrice">
				租金总额：<text>￥{{(list.value*list.price*list.num).toFixed(2)}}</text>
			</view>
		</view>
		<!--  v-if="shop.ya_type == 1" -->
		<view class="DetailsYa" v-if="list.statusTwo !=2 && list.ya_type!=-1"
			style="display: flex;justify-content: space-between;">
			<view class="DetailsYaTiele">
				押金
				<image src="https://www.kmdj2018.com/Uploads/zfb/wenhao.png" mode="aspectFit"
					@click="getnav('/pages/etailedArticle/etailedArticle','押金介绍')"></image>
			</view>
			<view>
				0
			</view>
			<!-- <view class="DetailsYaFlex">
				<view>
					微信支付分{{list.dit}}分以上可享受免押金
				</view>
				<view>
					0
				</view>
			</view> -->
		</view>
		<!-- 保险 -->
		<u-checkbox-group v-model="checkboxValue1" placement="column" @change="checkboxChange">
			<view class="DetailsYa" v-for="(item, index) in baoxianList" :key="item.id">
				<view style="display: flex;justify-content: space-between;">
					<view class="DetailsYaTiele">
						{{item.name || ''}}
					</view>
					<view>
						<u-checkbox shape="circle" activeColor="#F7BC1C" :name="item.name"></u-checkbox>
					</view>
				</view>
				<view class="DetailsYaFlex">
					<view>
						运费险运费险（退还货免运费）
					</view>
					<view>
						￥{{item.price || '0'}}
					</view>
				</view>
			</view>

		</u-checkbox-group>

		<view class="DetailsFei" v-if="list.statusTwo == 3">
			<view class="DetailsFeiTiele">
				费用明细
			</view>
			<view class="DetailsFeiFlex">
				<view>
					租赁费（下期续费{{list.price*list.num}}元）
				</view>
				<view>
					￥{{list.price*list.num}}元/期
				</view>
			</view>
			<view class="DetailsFeiFlex">
				<view>
					押金
				</view>
				<view>
					￥{{xinyongfen>=list.dit?'0':list.deposit}}
				</view>
			</view>
			<view class="DetailsFeiFlex colorRed">
				<view>
					合计
				</view>
				<view>
					{{
						xinyongfen>=list.dit?parseFloat(list.price*list.value*list.num).toFixed(2):(parseFloat(list.price*list.value*list.num)+parseFloat(list.deposit)).toFixed(2)
					}}
				</view>
			</view>
		</view>
		<view class="DetailsFei" v-if="list.statusTwo == 1">
			<view class="DetailsFeiTiele">
				费用明细
			</view>
			<view class="DetailsFeiFlex">
				<view>
					租赁费（下期续费{{parseFloat(list.zuday)>60?parseFloat(list.dan_price * 30 * list.num).toFixed(2):(parseFloat(list.dan_price * list.zuday) - parseFloat(list.dan_price) * 30)*list.num.toFixed(2)}}元）
				</view>
				<view>
					￥{{parseFloat(list.dan_price * 30 * list.num).toFixed(2)}}元/期
				</view>
			</view>
			<view class="DetailsFeiFlex">
				<view>
					押金
				</view>
				<view>
					￥{{xinyongfen>=list.dit?'0':list.deposit}}
				</view>
			</view>
			<view class="DetailsFeiFlex colorRed">
				<view>
					合计
				</view>
				<view>
					{{
						xinyongfen>=list.dit?parseFloat(list.dan_price * list.zuday * list.num).toFixed(2):(parseFloat(list.dan_price * list.zuday * list.num)+parseFloat(list.deposit)).toFixed(2)
					}}
				</view>
			</view>
		</view>
		<view class="DetailsFei" v-if="list.statusTwo ==2">
			<view class="DetailsFeiFlex colorRed">
				<view>
					金额
				</view>
				<view>
					￥{{
						parseFloat(list.zong_price * list.num).toFixed(2)
					}} 元
				</view>
			</view>
		</view>
		<view class="DetailsPhone" v-if="list.statusTwo != 2">
			<view class="DetailsPhoneTiele">
				填写推荐人手机号
			</view>
			<view class="DetailsPhoneInput">
				<input type="text" placeholder="如无推荐人可不填" placeholder-style="font-size: 28rpx;color: #999999;"
					v-model="phone" />
			</view>
		</view>
		<view class="DetailsXieYi" v-if="list.statusTwo == 3">
			<view :class="agree_type?'backRed':''" @click="agree_type = !agree_type"></view>
			同意
			<text @click="getnav('/pages/etailedArticle/etailedArticle','自动扣费')">《自动扣费协议》</text>
			，到期自动续费
			<image src="https://www.kmdj2018.com/Uploads/zfb/wenhao.png" mode="aspectFit"></image>
		</view>
		<view class="DetailsXieYitwo" v-if="list.statusTwo == 1">
			<view :class="agree_type?'backRed':''" @click="agree_type = !agree_type"></view>
			同意自动扣费协议，到期自动扣费
			<image src="https://www.kmdj2018.com/Uploads/zfb/wenhao.png" mode="aspectFit"></image>与
			<text @click="getnav('/pages/etailedArticle/etailedArticle','租赁服务协议')">《租赁服务协议》</text>
			和
			<text @click="getnav('/pages/etailedArticle/etailedArticle','隐私协议')">《隐私政策》</text>
		</view>
		<view class="DetailsBut">
			<view class="DetailsButF">
				<view class="DetailsButFleft">
					总价： <text v-if="list.statusTwo == 3">￥{{
						xinyongfen>=list.dit?parseFloat(list.price*list.value *list.num).toFixed(2):(parseFloat(list.price*list.value*list.num)+parseFloat(list.deposit)).toFixed(2)
					}}</text>
					<text v-if="list.statusTwo == 2">￥{{
						(parseFloat(list.zong_price)* list.num).toFixed(2)
					}}</text>
					<text v-if="list.statusTwo == 1">￥{{
						xinyongfen>=list.dit?parseFloat(list.dan_price * list.zuday * list.num).toFixed(2):(parseFloat(list.dan_price * list.zuday * list.num)+parseFloat(list.deposit)).toFixed(2)
					}}</text>
				</view>
				<view class="DetailsButFright">
					<button @click="getSub">立即提交</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import lxcCount from '@/components/lxc-count/lxc-count.vue'
	export default {
		data() {
			return {
				phone: '',
				list: {
					day: "",
					deposit: "",
					dit: "",
					fan_price: "",
					img: "",
					name: "",
					num: null,
					photo: "",
					price: null,
					small_day: "",
					value: null,
					shop: {
						add_ress: "",
						area_name: "",
						city_name: "",
						name: "",
						phone: "",
						pro_name: "",
					}
				},
				xinyongfen: '',
				order_type: 1,
				address_id: '', // 默认地址id
				agree_type: false,
				addresList: [],
				real_name: '',
				real_userid: '',
				real_zheng: '',
				real_fan: '',
				idcard: '',
				mobile: '',
				accountNo: '',
				
				baoxianList: [],
				checkboxValue1: [],
			};
		},
		components: {
			lxcCount
		},
		onLoad(e) {
			// this.init()
			if (e.data) {
				let data = JSON.parse(decodeURIComponent(e.data))
				// console.log(data,'数据')
				this.list = data
				this.baoxianList = data.baoxian_list || []
			}
		},
		onShow() {
			this.initaddres()
		},
		methods: {
			unploadImg(type) {
				// H5  
				let url = ''
				// #ifdef MP-ALIPAY
				if (type == 1) {
					uni.chooseImage({
						count: 1,
						sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
						sourceType: ['album'], //从相册选择
						success: (res) => {
							url = res.tempFiles[0].path
							this.uploadPhoto(type, url)
						},
					});
				} else {
					uni.chooseImage({
						count: 1,
						sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
						sourceType: ['album'], //拍照
						success: (res) => {
							url = res.tempFiles[0].path
							this.uploadPhoto(type, url)
						},
					});
				}
				// #endif 
			},
			uploadPhoto(type, url) {
				uni.getFileSystemManager().readFile({
					filePath: url, //选择图片返回的相对路径
					encoding: 'base64', //编码格式
					success: res => { //成功的回调
						let base64 = 'data:image/jpeg;base64,' + res.data //不加上这串字符，在页面无法显示的哦
						this.$request("Home/upload", {
							data: {
								img: base64
							},
							isLoad: false
						}).then(res => {
							if (type == 1) {
								this.real_zheng = res.result
							} else {
								this.real_fan = res.result
							}

						})
					},
					fail: (e) => {
						console.log("图片转换失败", e);
					}
				})
			},
			initaddres() {
				this.$request("User/AddressList", {
					data: {

					},
					isLoad: false
				}).then(res => {
					this.addresList = res.result.filter(item => {
						return item.status == 1
					})
					this.address_id = this.addresList[0].id
				})
			},
			handleCountClick(val) {
				console.log("数量", val)
				this.list.value = val
			},
			init() {
				this.$request("User/index", {
					data: {

					},
					isLoad: false
				}).then(res => {
					this.xinyongfen = res.result.dit
				})
			},
			paymentAliHandler(orderno) {
				
				if (this.list.statusTwo == 2) {
					this.$request("Pay/HuaBeiPay", {
						data: {
							order_id: orderno
						},
						isLoad: false
					}).then(res => {
						my.tradePay({
							// 调用统一收单交易创建接口（alipay.trade.create），获得返回字段支付宝交易号trade_no
							// tradeNO: res.result,
							orderStr: res.result,
							success: (res) => {
								if (res.resultCode == 9000) {
									this.gettoast("支付成功")
									setTimeout(() => {
										uni.reLaunch({
											url: '/pages/tab/tabTwo/tabTwo'
										});
									}, 1000)
								}
							},
							fail: (res) => {

							}
						});
					})
					/* return
					this.$request("Pay/ZFByushouquan", {
						data: {
							orderno: orderno
						},
						isLoad: false
					}).then(res => {
						my.tradePay({
							// 调用统一收单交易创建接口（alipay.trade.create），获得返回字段支付宝交易号trade_no
							orderStr: res.result,
							success: (res) => {
								if(res.resultCode == 9000){
									this.gettoast("支付成功")
									this.$request("Pay/ZFBzhifu", {
										data: {
											orderno: orderno
										},
										isLoad: false
									}).then(res => {
										setTimeout(()=>{
											uni.reLaunch({
												url: '/pages/tab/tabTwo/tabTwo'
											});
										},1000)
									})
								}
							},
							fail: (res) => {
								
							}
						});
					}) */
				} else {
					// this.$request("Pay/ZFByushouquan", {
					// 	data: {
					// 		orderno: orderno
					// 	},
					// 	isLoad: false
					// }).then(res => {
					// 	my.tradePay({
					// 		// 调用资金冻结接口（alipay.fund.auth.order.app.freeze），获取支付宝预授权参数
					// 		orderStr: res.result,
					// 		success: (res1) => {
					// 			if (res1.resultCode == 9000) {
					// 				this.gettoast("支付成功")
					// 				this.$request("Pay/ZFBzhifu", {
					// 					data: {
					// 						orderno: orderno
					// 					},
					// 					isLoad: false
					// 				}).then(res => {
					// 					setTimeout(() => {
					// 						uni.reLaunch({
					// 							url: '/pages/tab/tabTwo/tabTwo'
					// 						});
					// 					}, 1000)
					// 				})
					// 			}
					// 		},
					// 		fail: (res) => {
					// 			this.gettoast("支付失败")
					// 		}
					// 	});
					// })
					
					
					this.$request("Pay/order_pay", {
						data: {
							order_id: orderno
						},
						isLoad: false
					}).then(res => {
						my.tradePay({
							// 调用统一收单交易创建接口（alipay.trade.create），获得返回字段支付宝交易号trade_no
							// tradeNO: res.result,
							orderStr: res.result,
							success: (res) => {
								if (res.resultCode == 9000) {
									this.gettoast("支付成功")
									setTimeout(() => {
										uni.reLaunch({
											url: '/pages/tab/tabTwo/tabTwo'
										});
									}, 1000)
								}
							},
							fail: (res) => {
						
							}
						});
					})
				}
			},
			getSub() {
				if (!this.agree_type && this.list.statusTwo != 2) {
					this.gettoast("请勾选自动扣费协议")
					return
				}
				if (this.phone) {
					if (this.phone.length != 11) {
						this.gettoast("请输入正确手机号")
						return
					}
				}
				if (!this.real_name) {
					this.gettoast("请输入姓名")
					return
				}
				if (!this.mobile) {
					this.gettoast("请输入手机号")
					return
				}
				if (!this.idcard) {
					this.gettoast("请输入身份证号码")
					return
				}
				if (!this.accountNo) {
					this.gettoast("请输入银行卡号码")
					return
				}
				if (!this.real_zheng) {
					this.gettoast("请上传身份证(人像面)")
					return
				}
				if (!this.real_fan) {
					this.gettoast("请上传身份证(国徽面)")
					return
				}
				
				let prices = 0
				let down_prices = 0
				let insurance_price = []
				if (this.list.statusTwo == 1) {
					down_prices = parseInt(this.list.dan_price * 30 * this.list.num).toFixed(2)
					prices = parseInt(this.list.dan_price * this.list.zuday * this.list.num).toFixed(2)
					if (this.checkboxValue1) {
						
						this.checkboxValue1.forEach(item => {
							let index = this.baoxianList.findIndex(key => key.id == item)
							if (index != -1) {
								insurance_price.push(item.price)
								prices += +this.baoxianList[index].price
								down_prices += +this.baoxianList[index].price
							}
						})
					}
					this.$request("Goods/PladeOrder", {
						data: {
							real_name: this.real_name,
							real_userid: this.idcard,
							real_zheng: this.real_zheng,
							real_fan: this.real_fan,
							goods_id: this.list.id,
							tuijian_phone: this.phone,
							num: this.list.num,
							day: this.list.zuday,
							price: prices,
							down_price: down_prices,
							deposit: this.xinyongfen >= this.list.dit ? 0 : this.list.deposit,
							statustwo: this.list.statusTwo,
							agree_type: this.agree_type ? '1' : '0',
							order_type: this.order_type,
							address_id: this.order_type == 1 ? '' : this.address_id,
							mobile: this.mobile,
							idcard: this.idcard,
							accountNo: this.accountNo,
							insurance_name: this.checkboxValue1 ? this.checkboxValue1.join(',') : '',
							insurance_price: insurance_price ? insurance_price.join(',') : '',
							insurance_all_price: prices
						},
						isLoad: false
					}).then(res => {
						
						// 调取支付宝支付
						// this.getback()
						this.paymentAliHandler(res.orderno)
					})
					// 立即购买
				} else if (this.list.statusTwo == 2) {
					this.$request("Goods/PladeOrder", {
						data: {
							real_name: this.real_name,
							real_userid: this.idcard,
							real_zheng: this.real_zheng,
							real_fan: this.real_fan,
							goods_id: this.list.id,
							tuijian_phone: this.phone,
							num: this.list.num,
							price: this.list.zong_price * this.list.num,
							down_price: this.list.zong_price * this.list.num,
							statustwo: this.list.statusTwo,
							agree_type: this.agree_type ? '1' : '0',
							order_type: this.order_type,
							address_id: this.order_type == 1 ? '' : this.address_id,
							mobile: this.mobile,
							idcard: this.idcard,
							accountNo: this.accountNo,
							insurance_name: this.checkboxValue1 ? this.checkboxValue1.join(',') : '',
						},
						isLoad: false
					}).then(res => {
						// 调取支付宝支付
						// this.getback()
						this.paymentAliHandler(res.orderno)
						
					})
					// 立即租用
				} else if (this.list.statusTwo == 3) {
					prices = (this.list.value * this.list.price * this.list.num).toFixed(2)
					down_prices = this.list.price * this.list.num
					if (this.checkboxValue1) {
						this.checkboxValue1.forEach(item => {
							let index = this.baoxianList.findIndex(key => key.id == item)
							if (index != -1) {
								prices += +this.baoxianList[index].price
								down_prices += +this.baoxianList[index].price
							}
						})
					}
					this.$request("Goods/PladeOrder", {
						data: {
							real_name: this.real_name,
							real_userid: this.idcard,
							real_zheng: this.real_zheng,
							real_fan: this.real_fan,
							goods_id: this.list.id,
							tuijian_phone: this.phone,
							num: this.list.num,
							periods: this.list.value,
							day: this.list.day * this.list.value,
							price: prices,
							down_price: down_prices,
							deposit: this.xinyongfen >= this.list.dit ? 0 : this.list.deposit,
							statustwo: this.list.statusTwo,
							agree_type: this.agree_type ? '1' : '0',
							order_type: this.order_type,
							address_id: this.order_type == 1 ? '' : this.address_id,
							mobile: this.mobile,
							idcard: this.idcard,
							accountNo: this.accountNo,
							insurance_name: this.checkboxValue1 ? this.checkboxValue1.join(',') : '',
						},
						isLoad: false
					}).then(res => {
						// 调取支付宝支付
						// this.gettoast("下单成功")
						// this.getback()
						this.paymentAliHandler(res.orderno)
					})
				}
			},
			checkboxChange(e) {
				console.log(e);
			}
		}
	}
</script>
<style lang="scss" scoped>
	.DetailsShop {
		background-color: #fff;
		padding: 32rpx;

		.DetailsShopTop {
			display: flex;
			align-items: center;
			margin-bottom: 48rpx;

			.DetailsShopTopLeft {
				image {
					width: 160rpx;
					height: 160rpx;
					border-radius: 16rpx;
				}
			}

			.DetailsShopTopRight {
				margin-left: 32rpx;

				>view:nth-child(1) {
					font-size: 32rpx;
					font-weight: bold;
					color: #323233;
					margin-bottom: 24rpx;
				}

				>view:nth-child(2) {
					font-size: 24rpx;
					color: #323233;
					margin-bottom: 24rpx;
				}

				>view:nth-child(3) {
					font-size: 24rpx;
					color: #323233;
				}
			}
		}
	}

	.DetailsTime {
		background-color: #fff;
		margin-top: 20rpx;
		padding: 20rpx;

		.DetailsTimeTiele {
			font-size: 32rpx;
			font-weight: bold;
		}

		.DetailsTimePrice {
			font-size: 28rpx;
			margin-top: 32rpx;

			>text {
				color: #F23D0E;
				font-weight: bold;
			}
		}

		.DetailsTimeNum {
			// margin-top: 32rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			>view:first-child {
				color: #323233;
				font-size: 28rpx;

				>text {
					margin: 0 10rpx;
					color: #707070;
				}
			}

			>view:last-child {}
		}
	}

	.DetailsYa {
		background-color: #fff;
		margin-top: 20rpx;
		padding: 32rpx;

		.DetailsYaTiele {
			display: flex;
			align-items: center;
			font-size: 32rpx;
			font-weight: bold;

			image {
				width: 28rpx;
				height: 28rpx;
				margin-left: 16rpx;
			}
		}

		.DetailsYaFlex {
			margin-top: 34rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			>view {
				display: flex;
				align-items: center;
				font-size: 28rpx;

				image {
					width: 30rpx;
					height: 36rpx;
					margin-right: 12rpx;
				}
			}

			>view:last-child {
				font-weight: bold;
			}
		}
	}

	.DetailsFei {
		background-color: #fff;
		margin-top: 20rpx;
		padding: 32rpx;

		.DetailsFeiTiele {
			font-size: 32rpx;
			font-weight: bold;
		}

		.DetailsFeiFlex {
			margin-top: 34rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;

			>view {
				font-size: 28rpx;
			}

			>view:last-child {
				font-weight: bold;
			}
		}
	}

	.DetailsPhone {
		background-color: #fff;
		margin-top: 20rpx;
		padding: 32rpx;

		.DetailsPhoneTiele {
			font-size: 32rpx;
			font-weight: bold;
		}

		.DetailsPhoneInput {
			margin-top: 34rpx;
			border-bottom: 1rpx solid #E6E7EB;
		}
	}

	.colorRed {
		border-top: 1rpx solid #E6E7EB;
		padding-top: 34rpx;
		margin-top: 0rpx;

		>view:last-child {
			color: #F23D0E;
		}
	}

	.DetailsXieYi {
		display: flex;
		align-items: center;
		font-size: 24rpx;
		color: #323233;
		padding: 0 32rpx;
		margin: 42rpx 0 142rpx 0;
		padding-bottom: 142rpx;

		>text {
			font-size: 24rpx;
			color: #F7BC1C;
		}

		>view {
			width: 24rpx;
			height: 24rpx;
			border: 1rpx solid #666666;
			border-radius: 100rpx;
			margin-right: 12rpx;
		}

		>.backRed {
			width: 24rpx;
			height: 24rpx;
			background-color: #F7BC1C;
			border-radius: 100rpx;
			margin-right: 12rpx;
			border: none !important;
		}

		>image {
			width: 28rpx;
			height: 28rpx;
			margin-left: 12rpx;
		}
	}

	.DetailsBut {
		width: 100%;
		height: 120rpx;
		background-color: #fff;
		position: fixed;
		bottom: 0;

		.DetailsButF {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 20rpx 38rpx;

			.DetailsButFleft {
				font-size: 28rpx;
				color: #323233;

				>text {
					font-size: 40rpx;
					color: #F23D0E;
					font-weight: bold;
				}
			}

			.DetailsButFright {
				button {
					background-color: #F7BC1C;
					width: 210rpx;
					height: 72rpx;
					line-height: 72rpx;
					color: #323233;
					font-size: 32rpx;
					font-weight: bold;
					border-radius: 100rpx;
				}
			}
		}
	}

	.DetailsXieYitwo {
		// display: flex;
		align-items: center;
		font-size: 24rpx;
		color: #323233;
		padding: 0 32rpx;
		margin: 42rpx 0 180rpx 0;
		line-height: 40rpx;

		>text {
			font-size: 24rpx;
			color: #F7BC1C;
		}

		>.backRed {
			width: 24rpx;
			height: 24rpx;
			background-color: #F7BC1C;
			border-radius: 100rpx;
			margin-right: 12rpx;
			border: none !important;
		}

		>view {
			width: 24rpx;
			height: 24rpx;
			border: 1rpx solid #666666;
			border-radius: 100rpx;
			margin-right: 12rpx;
			display: inline-block;
			margin-bottom: -4rpx;
		}

		>image {
			width: 28rpx;
			height: 28rpx;
			margin-left: 12rpx;
		}
	}

	.tabaddd {

		background-color: #FFF2CE;
		margin-top: 20rpx;
		width: 100%;

		.tabaddd_top {
			display: flex;
			line-height: 92rpx;
			height: 92rpx;
			text-align: center;

			text {
				font-size: 32rpx;
				font-weight: 600;
				width: 50%;
				color: #F7BC1C;
			}

			.textColor {
				background-color: #F7BC1C;
				color: #fff;
			}
		}

		.shopJia {
			background-color: #fff;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 32rpx;

			.shopJiaLeft {
				width: 100%;

				>view {
					display: flex;
					align-items: center;
					margin-top: 20rpx;

					image {
						width: 44rpx;
						height: 44rpx;
						margin-right: 16rpx;
					}

					text {
						font-size: 28rpx;
						color: #323233;
					}
				}

				// >view:first-child {
				// 	margin-bottom: 20rpx;
				// 	display: flex;
				// 	align-items: center;
				// 	justify-content: space-between;

				// 	text {
				// 		font-weight: bold;
				// 	}

				// 	>text:nth-child(2) {
				// 		color: #1078FF;
				// 		border-radius: 100rpx;
				// 		border: 1rpx solid #1078FF;
				// 		padding: 14rpx 24rpx;
				// 	}
				// }

				>view:first-child {
					margin-top: 0 !important;

					text {
						font-weight: bold;
					}
				}
			}

			.shopJiaRight {
				image {
					width: 48rpx;
					height: 48rpx;
				}
			}
		}

		.tabaddd_address {

			.tabaddd_address_null {
				display: flex;
				background-color: #fff;
				align-items: center;
				padding: 70rpx 32rpx;

				.tabaddd_address_null_img {
					flex: 1;

					image {
						width: 42rpx;
						height: 42rpx;
					}
				}

				.tabaddd_address_null_text {
					flex: 8;
					font-size: 28rpx;
					color: #323233;
					font-weight: 600;

					text {
						font-size: 28rpx;
						color: #999999;
					}
				}
			}

			.tabaddd_address_res {
				display: flex;
				background-color: #fff;
				align-items: center;
				padding: 0 32rpx;

				.tabaddd_address_null_img {
					flex: 1;

					image {
						width: 42rpx;
						height: 42rpx;
					}
				}

				.tabaddd_address_null_text {
					flex: 8;

					.addlisttop {
						padding: 32rpx 0;

						.addlisttop_text {
							.addlisttop_left {
								display: inline-block;
								font-size: 28rpx;
								width: 200rpx;
								color: #323233;
							}

							.addlisttop_right {
								display: inline-block;
								font-size: 28rpx;
								color: #323233;
							}
						}

						.addlisttop_address {
							font-size: 28rpx;
							color: #323233;
							margin-top: 15rpx;
						}

					}
				}

			}
		}
	}

	.allinfo {
		margin-top: 20rpx;
		background-color: #fff;
		padding: 0 30rpx 20rpx 30rpx;

		.allinfo_title {
			font-size: 32rpx;
			font-weight: bold;
			padding: 20rpx 0;
		}

		.allinfo_for {
			font-size: 28rpx;
			border-bottom: 1rpx solid #d3d3d3;
			margin-bottom: 20rpx;

			input {
				font-size: 28rpx;
			}
		}

		.allinfo_imgfor {
			font-size: 28rpx;
			border-bottom: 1rpx solid #d3d3d3;
			margin-bottom: 20rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 20rpx 0;

			image {
				width: 100rpx;
				height: 50rpx;
			}
		}
	}
</style>